<#include "/public/macro.html">
<#if workOrders??><input type="hidden" name="id" value="${workOrders.id!''}"></#if>
<#if workOrders??><input type="hidden" name="status" id="status" value="${workOrders.status!''}"></#if>
<div class="row" style="border-bottom: 1px solid #EFEFEF;">
	<div class="col-lg-12" style="padding-left:0px;position: relative;">
		<div class="ukefu-bt"> 
			<div class="layui-icon ukewo-btn ukefu-content-ind" style="width: 40px;height: 40px;">
				<img src="/images/workorders.png"></div>
			<div class="ukefu-bt-text">
				<div class="ukefu-bt-text-title" style="font-weight:400;font-size:20px;">
					<#if workOrders??>${(workOrders.title!'')?no_esc}</#if>
				</div>
				<div class="ukefu-bt-text-content" style="">
					<#if workOrders?? && workOrders.createtime??><span style="font-size:15px;color:#AAAAAA;">工单创建时间：${workOrders.createtime?string('yyyy-MM-dd HH:mm:ss')}</span></#if>
					<#if workOrders?? && workOrders.updatetime??><span style="font-size:15px;color:#AAAAAA;margin-left:30px;">最后更新于：${workOrders.updatetime?string('yyyy-MM-dd HH:mm:ss')}</span></#if>
				</div>
				
			</div>
		</div>
		<#if user.usertype ?? && user.usertype == "0">
		<div style="position: absolute;right: 0px;"> 
			<a class="layui-btn layui-btn-sm" href="/apps/workordersthree/edit.html?id=${workOrders.id!''}" title="创建新工单">编辑工单</a>
			<div class="layui-btn-group ukefu-btn-group">
				<a class="layui-btn layui-btn-sm layui-btn-danger" href="/apps/workordersthree/delete.html?id=${workOrders.id!''}" id="batexp" data-toggle="tip" title="工单删除不可恢复，请确认是否删除工单？">
					<i class="layui-icon">&#x1006;</i>
					删除工单
				</a>
			</div>
		</div>
		</#if>
	</div>
</div>
<h1 class="site-h1 ukefu-tab" style="border-top:1px solid #e6e6e6;height:26px;">
	<div class="ukefu-tab-title" style="margin-left:0px;">
		<ul class="tab-title" id="workDetailsTab">
			<li class="layui-this"><a href="/apps/workordersthree/myorders/detail.html?id=${workOrders.id!''}" data-toggle="load" data-target="#workordersdetail">工单详情</a></li>
			<li><a href="/apps/workordersthree/detail/dataevent.html?orderid=${workOrders.id!''}" data-toggle="load" data-target="#workOrderContent">变更记录</a></li>
			<li><a href="/apps/workordersthree/detail/comments.html?orderid=${workOrders.id!''}" data-toggle="load" data-target="#workOrderContent">回复记录</a></li>
			<#if workOrders.cusid??>
			<li><a href="/apps/contacts/detail.html?id=${workOrders.cusid!''}" data-toggle="load" data-target="#workOrderContent">联系人信息</a></li>
			</#if>
			<#if workOrderType?? && workOrderType.bpm>
			<li><a href="/apps/bpm/instance/display.html?processid=${workOrders.bpmid!''}&orderid=${workOrders.memo!''}" data-toggle="load" data-target="#workOrderContent">流程信息</a></li>
			</#if>
		</ul>					
	</div>
</h1>
<div id="workOrderContent">
	<div class="row" style="border-bottom: 1px solid #EFEFEF;">
		<div class="col-lg-12" style="padding-left:0px;padding-right:0px;">
			<#include "/apps/business/workordersthree/include/info.html">
		</div>
	</div>
	<form class="layui-form" id="workOrdersForm" action="/apps/workordersthree/myorders/save.html" method="post" style="width: 100%;height: 100%;" data-toggle="ajax-form" data-target="#workordersdetail">
		<#if workOrders??><input type="hidden" name="id" value="${workOrders.id!''}"></#if>
		<#if workOrders??><input type="hidden" name="dataid" value="${workOrders.id!''}"></#if>
		<div class="row" style="border-bottom: 1px solid #EFEFEF;">
			<div class="col-lg-12" style="padding-left:0px;padding-right:0px;">
				<h1 class="site-h1" style="border-top:1px solid #e6e6e6;margin-top:0px;">
					工单回复
				</h1>
				<div id="ukefu-comments">
					<div class="ukefu-workorders-comment" id="ukefu-workorders-comment">
						<#if orderCommentList?? && orderCommentList.content?size gt 0>
						<#include "/apps/business/workordersthree/comments.html">	
						</#if>
					</div>
				</div>
				
				
				<h1 class="site-h1" style="border-top:1px solid #e6e6e6;margin-top:15px;">
					回复
				</h1>
				<div class="row" style="margin-top:5px;">
					<div class="col-lg-12" style="padding-left:0px;line-height:30px;padding-right:0px;">
						<div class="layui-form-item">
						    <div class="layui-input-block" style="margin-left:75px;">
						      	<input type="radio" name="prirep" value="0" title="公开回复" checked>
						      	<input type="radio" name="prirep" value="1" title="私密回复（只有坐席可见）">
						    </div>
						</div>	
					</div>
				</div>
				<div class="row" style="margin-top:5px;">
					<div class="col-lg-12" style="padding-left:0px;line-height:30px;padding-right:0px;padding-left:75px;">
						<textarea name="content" id="content" style="width:100%;height:60px;"></textarea>	
					</div>
				</div>
				<div class="layui-button-block" style="margin-top:20px;margin-left:75px;text-align:left;">
					<button class="layui-btn" lay-submit="" lay-filter="formDemo">立即提交</button>
					<button type="reset" class="layui-btn layui-btn-primary">重置</button>
				</div>
			</div>
		</div>
	</form>
</div>
<script>
	$(document).ready(function() {
		layui.use('form', function() {
			var form = layui.form;
			form.render(); //更新全部
		});
		$('#workDetailsTab li a').on("click" , function(){
			$('#workDetailsTab li').removeClass("layui-this");
			$(this).parent().addClass("layui-this");
		});
		
		layui.use(['element', 'flow'], function(){
		  	var element = layui.element ;
		  	var flow = layui.flow;
			flow.load({
			    elem: '#ukefu-comments' //指定列表容器
			   	,scrollElem:".ukefu-col-right"
			    ,done: function(page, next){ //到达临界点（默认滚动触发），触发下一页
			      $.get('/apps/workordersthree/comments.html?orderid=${workOrders.id!''}&p='+page, function(res){
			        //假设你的列表返回在data集合中
			        
			        //执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
			        //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
			        next($('#ukefu-workorders-comment').append(res) , $(res).length > 0);    
			      });
			    }
			});
		});
		KindEditor.ready(function(K) {
			K.create('#content', {
				themeType : 'simple',
				width:"100%",
				resizeType:0,
				uploadJson : "/res/image/upload.html",
				items : ['fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
						 'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
						 'insertunorderedlist', '|', 'emoticons', 'image', 'link'],
	            allowFileManager : false,
				fontsize:16
			});
		});
		KindEditor.options.cssData = "body { font-size: 15px; font-family:'Microsoft Yahei', 'Helvetica', 'Simsun', 'Arial';}";
	});
</script>